<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录界面</title>
    <link rel="stylesheet" type="text/css" href="../static/css/zui.css" media="all">
    <link rel="stylesheet" type="text/css" href="../static/css/login.css" media="all">
    <link href="../static/css/animate.min.css" rel="stylesheet">
    <link href="../static/css/font-awesome.min.css" rel="stylesheet">
    <style> body {
        background-image: url('../static/images/4.jpg')
    }</style>
    <script src="../static/js/jquery.js"></script>
    <script src="../static/js/jquery.cookie.js"></script>
</head>
<body>
<div id="main-box"></div>
<div id="main-content">
    <div class="login-body  animated fadeInLeft">
        <div class="login-main pr">
            <form class="login-form">
                <h3> 实验室管理中心 </h3>
                <h5 style="padding-bottom: 10px">Laboratory Management Center </h5>
                <!-- 账号登陆 -->
                <div id="MobileBox" class="item-box">
                    <div class="input-group user-name"><span class="input-group-addon">
                        <i class="icon-user"></i>
                    </span>
                        <input type="text" name="userid" id="userid" class="form-control" placeholder="学号/工号/账号">
                    </div>
                    <div class="input-group password"><span class="input-group-addon"><i class="icon-lock"></i></span>
                        <input type="password" name="password" id="pwd" class="form-control" placeholder="密码">
                    </div>

                    <div class="use-qrcode-a">
                        <label for="remember"><input type="checkbox" id="remember"><span
                                style="color: #08897e">记住密码</span></label>
                        <a class="use-ding" href="userRegister.html">注册账号</a>
                    </div>

                    <div class="login_btn_panel">
                        <button class=" btn btn-primary btn-block btn-lg" data-ajax="post" type="button"
                                data-callback="success" onclick="login()">登录
                        </button>
                        <div class="check-tips"></div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<script>

    $(function () {
        if ($.cookie("userid") != null || $.cookie("pwd") != null) {
            //获取对应的密码,并把用户名,密码赋值给表单
            document.getElementById("userid").value = $.cookie("userid");
            document.getElementById("pwd").value = $.cookie("pwd");
            $("#remember").prop("checked", true);
        } else {
            $("#remember").prop("checked", false);
        }
    });

    function login() {
        let userid = document.getElementById("userid").value;
        let pwd = document.getElementById("pwd").value;
        let remember = document.getElementById("remember");

        let data = {"userid": userid, "password": pwd};

        //判断用户名,密码是否为空(全空格也算空)
        if (userid.length != 0 && pwd.length != 0) {
            //若复选框勾选,则添加Cookie,记录密码
            if (remember.checked) {
                $.cookie("userid", userid, {expires: 7});
                $.cookie("pwd", pwd, {expires: 7});
            } else {
                //否则清除Cookie
                $.cookie("userid", null);
                $.cookie("pwd", null);
            }

            $.post('http://localhost:8080/user/login', data, function (result) {
                let res = result.object;
                if (result.code != '200') {
                    alert(result.msg);
                } else if (result.code == '200') {
                    if (res.priority === 2) {
                        window.location.href = "adminManage.html";
                    } else if (res.priority === 1) {
                        window.location.href = "index.html";
                    } else {
                        window.location.href = "index.html";
                    }
                }
            });
            return true;
        } else {
            alert('请输入必填字段!!!')
            return false;
        }
    }
</script>
</body>
</html>